<template>
    <div id="app">
        <!--使用组件-->
        <Header :name="msg" :title="28" :p="people"></Header>
        <Main></Main>
        <Footer></Footer>
        {{msg}}
    </div>
</template>
<!--
    1. 导入组件到当前组件中.import 别名  from '组件路径'
    2. 注册组件  components:{ 别名,}
    3. 使用组件---和使用html标签没有区别
-->
<script>
    /*导入想用的组件--局部注册--只能在当前组件中使用
    *   import 起别名  from '要使用的组件路径'
    * */
    import Header from './components/Head.vue'
    import Main from './components/Main.vue'
    import Footer from './components/Footer.vue'

    export default {
        name: 'app',
        //注册该组件
        components: {
            Header,
            Main,
            Footer
        },
        //定义vue数据。该数据只能在当前vue组件中使用
        data(){
           return {
               msg:"hello 我是罗钦盛,帅哥一枚",
               people:{
                   name:"张梓康",
                   age:19,
                   sex:"女"
               }

           }
        }
    }
</script>

<style>

</style>
